<template>
  <div>
    <div id="components-form-demo-advanced-search" style="margin: 20px 10px">
      <a-row :gutter="24" style="margin-bottom: 15px">
        <a-col :span="6">
          处理批次号：<a-input
          :maxLength="128"
            v-model="searchData.batchNo"
            style="width: 60%"
          />
        </a-col>
        <a-col :span="6">
          客户编号：
          <a-select
            style="width: 60%"
            show-search
            option-filter-prop="children"
            :filter-option="filterOption"
            v-model="searchData.tenantId"
          >
            <a-select-option
              :value="item.tenantId"
              v-for="item in accArray"
              :key="item.id"
              :titles="item.title"
            >
              {{ item.tenantId }}
            </a-select-option>
          </a-select>
        </a-col>
        <a-col :span="6">
          有无客户编号：
          <a-select
            default-value="lucy"
            style="width: 60%"
            @change="handleChange"
            v-model="searchData.isNo"
          >
            <a-select-option value="1"> 有 </a-select-option>
            <a-select-option value="2"> 无 </a-select-option>
            <a-select-option value="3"> 全部 </a-select-option>
          </a-select>
        </a-col>
        <a-col :span="6">
          <div>
            <a-button
              type="primary"
              class="searchBtn"
              @click="
                () => {
                  getTabList();
                }
              "
            >
              查询
            </a-button>
            <a-button
              style="margin: 0 10px"
              type="primary"
              class="searchBtn"
              @click="resetSearch"
            >
              重置
            </a-button>
          </div>
        </a-col>
      </a-row>
    </div>
    <p v-if="tabKey != '1' && tabKey != '3' && tabKey != '146'">
      <a-button
        type="primary"
        style="
          background: #66b1ff;
          color: #fff;
          border: none;
          margin-left: 8px;
          margin-right: 20px;
        "
        @click="showMoadal"
      >
        创建新的扫描处理批次
      </a-button>
    </p>
    <a-spin tip="Loading..." :spinning="spinning">
      <a-table
        :columns="columns"
        :data-source="tabData"
        :pagination="false"
        :scroll="{ x: 1200 }"
      >
        <span slot="days" slot-scope="text, record">
          <span>
            {{ record.days }}
          </span>
        </span>
        <span slot="waybillCount" slot-scope="text, record">
          {{ record.waybillCount === null ? "暂无" : record.waybillCount }}
        </span>
        <span slot="putCount" slot-scope="text, record">
          {{ record.putCount === null ? "暂无" : record.putCount }}
        </span>
        <span slot="destructionCount" slot-scope="text, record">
          {{
            record.destructionCount === null ? "暂无" : record.destructionCount
          }}
        </span>
        <span slot="batchState" slot-scope="text, record">
          <span style="color: #3eae7c">
            {{ record.batchState === null ? "暂无" : record.batchState }}
          </span>
        </span>
        <span slot="backCount" slot-scope="text, record">
          {{ record.backCount === null ? "暂无" : record.backCount }}
        </span>
        <span slot="createTime" slot-scope="text, record">
          {{
            record.createTime === null
              ? "暂无"
              : record.createTime.replace("T", "  ")
          }}
        </span>
        <span slot="remark" slot-scope="text, record">
          {{ record.remark === null ? "暂无" : record.remark }}
        </span>
        <span slot="action" class="action" slot-scope="text, record">
          <a
            v-if="
              (record.state === '36' || record.state === '136') &&
              record.isServiceItem * 1 === 0
            "
            slot="action"
            style="color: #2929e0; border-bottom: 1px solid #2929e0"
            href="javascript:;"
            @click="returnServiceModal(record)"
            >服务项登记</a
          >
          <a-divider
            type="vertical"
            v-if="
              (record.state === '36' || record.state === '136') &&
              record.isServiceItem * 1 === 0
            "
          />
          <a
            v-if="record.state != '26' && record.isServiceItem * 1 >= 1"
            slot="action"
            style="color: #2929e0; border-bottom: 1px solid #2929e0"
            href="javascript:;"
            @click="costServiceInfo(record)"
            >服务项登记查看</a
          >
          <a-divider
            type="vertical"
            v-if="record.state != '26' && record.isServiceItem * 1 >= 1"
          />
          <a
            v-if="
              record.batchState === '未加入运单' &&
              record.tenantId != null &&
              record.tenantId != ''
            "
            slot="action"
            style="color: #2929e0; border-bottom: 1px solid #2929e0"
            href="javascript:;"
            @click="onSubmitRow(record)"
            >提交</a
          >
          <a-divider
            type="vertical"
            v-if="
              record.batchState === '未加入运单' &&
              record.tenantId != null &&
              record.tenantId != ''
            "
          />
          <a
            slot="action"
            style="color: #2929e0; border-bottom: 1px solid #2929e0"
            href="javascript:;"
            @click="rowInfo(record)"
            >详细数据</a
          >
        </span>
      </a-table>
    </a-spin>
    <!-- 分页器 -->
    <div style="margin: 20px 0; text-align: center">
      <a-config-provider>
        <a-pagination
          show-size-changer
          :pageSizeOptions="['10', '20', '30']"
          :show-total="
            (total) => `${$t('m.page.Total')} ${total} ${$t('m.page.items')}`
          "
          @showSizeChange="showChange"
          :buildOptionText="
            (props) => ` ${props.value} ${$t('m.page.a')}/${$t('m.page.page')}`
          "
          show-quick-jumper
          :default-current="searchData.current"
          :total="total"
          @change="onChangePage"
        />
      </a-config-provider>
    </div>
    <a-modal v-model="visible" title="创建批次">
      <template slot="footer" class="modelBtn">
        <a-button
          @click="visible = false"
          style="background: #d7d7d7; color: #fff; border: none"
          >取消</a-button
        >

        <a-button :loading="loading" type="primary" @click="onSubmit()"
          >确认</a-button
        >
      </template>
      <a-form-model
        style="width: 70%; margin: 0 auto"
        ref="ruleForm"
        :model="addBath"
        :rules="rules"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item label="客户编号：" prop="tenantId">
          <a-select
            show-search
            option-filter-prop="children"
            :filter-option="filterOption"
            v-model="addBath.tenantId"
          >
            <a-select-option
              :value="item.tenantId"
              v-for="item in accArray"
              :key="item.id"
              :titles="item.title"
            >
              {{ item.tenantId }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="批次名称：" prop="batchName">
          <a-input :maxLength="128" v-model="addBath.batchName" />
        </a-form-model-item>
        <a-form-model-item label="仓库选择：" prop="warehousingId">
          <a-select
            show-search
            option-filter-prop="children"
            :filter-option="filterOption"
            v-model="addBath.warehousingId"
            @change="handleChange"
          >
            <a-select-option
              :value="item.warehouseId"
              v-for="item in warehouse"
              :key="item.warehouseId"
              :name="item.titleName"
            >
              {{ item.titleName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="销毁时间:" prop="endTime">
          <a-date-picker
            :showToday="false"
            @change="onChangeTime"
            v-model="endTime"
            :disabledDate="disabledDate"
          />
        </a-form-model-item>
      </a-form-model>
    </a-modal>

    <!-- //详细数据表格 -->
    <a-modal v-model="tabInfoVisible" title="详细数据" width="80%">
      <template slot="footer" class="modelBtn">
        <a-button
          @click="tabInfoVisible = false"
          style="background: #d7d7d7; color: #fff; border: none"
          >取消</a-button
        >
        <a-button
          v-if="tabRowState === '36'"
          :loading="loading"
          type="primary"
          @click="onSubmitDataInfo()"
          >提交</a-button
        >
      </template>
      <a-table
        :data-source="tableListModal"
        :pagination="false"
        :scroll="{ x: 1300 }"
      >
        <!-- 物流商 -->
        <a-table-column
          key="logisticsName"
          data-index="logisticsName"
          align="center"
          width="10%"
        >
          <span slot="title"> 物流商</span>
          <template slot-scope="text, record">
            {{ record.logisticsName }}
          </template>
        </a-table-column>
        <!-- 运单号 -->
        <a-table-column
          key="waybillNm"
          data-index="waybillNm"
          align="center"
          width="18%"
        >
          <span slot="title">运单号</span>
          <template slot-scope="text, record">
            <span>
              {{ record.waybillNm }}
            </span>
          </template>
        </a-table-column>
        <!-- 商品名称 -->
        <a-table-column
          key="skuName"
          data-index="skuName"
          align="center"
          width="10%"
        >
          <span slot="title">商品名称</span>
          <template slot-scope="text, record">
            {{ record.skuName }}
          </template>
        </a-table-column>
        <!-- 退件SKU -->
        <a-table-column key="sku" data-index="sku" align="center" width="10%">
          <span slot="title">退件SKU</span>
          <template slot-scope="text, record">
            <span>
              {{ record.sku }}
            </span>
          </template>
        </a-table-column>
        <!-- 退件数量 -->
        <a-table-column
          key="productNumber"
          data-index="productNumber"
          align="center"
          width="10%"
        >
          <span slot="title">退件数量</span>
          <template slot-scope="text, record">
            <span>
              {{ record.productNumber }}
            </span>
          </template>
        </a-table-column>
        <!-- 箱数 -->
        <a-table-column
          key="packingNumber"
          data-index="packingNumber"
          align="center"
          width="8%"
        >
          <span slot="title"> 箱数</span>
          <template slot-scope="text, record">
            <!-- <a-input-number
              size="small"
              v-model="record.packingNumber"
              :min="1"
            /> -->
            {{ record.packingNumber }}
          </template>
        </a-table-column>
        <!-- 长宽高 -->
        <a-table-column
          key="lengthNumber"
          data-index="lengthNumber"
          align="center"
          width="20%"
        >
          <span slot="title">长*宽*高(cm)</span>
          <template slot-scope="text, record" class="box-sizes">
            <!-- <a-input-number
              size="small"
              style="width: 25%"
              v-model="record.lengthNumber"
              :min="1"
            />*
            <a-input-number
              size="small"
              style="width: 25%"
              v-model="record.wideNumber"
              :min="1"
            />*
            <a-input-number
              size="small"
              style="width: 25%"
              v-model="record.highNumber"
              :min="1"
            /> -->
            {{ record.lengthNumber }}*{{ record.wideNumber }}*{{
              record.highNumber
            }}
          </template>
        </a-table-column>
        <!-- 重量 -->
        <a-table-column
          key="caratNumber"
          data-index="caratNumber"
          align="center"
          width="10%"
        >
          <span slot="title"> 重量(Kg)</span>
          <template slot-scope="text, record" class="box-sizes">
            <!-- <a-input-number
              size="small"
              v-model="record.caratNumber"
              :min="1"
            /> -->
            {{ record.caratNumber === null ? "暂无" : record.caratNumber }}
          </template>
        </a-table-column>
        <!-- //处理方式 -->
        <a-table-column
          key="typeName"
          data-index="typeName"
          align="center"
          width="10%"
        >
          <span slot="title"> 处理方式</span>
          <template slot-scope="text, record" class="box-sizes">
            {{ record.typeName === null ? "暂无" : record.typeName }}
          </template>
        </a-table-column>
        <!-- 库位选择 -->
        <a-table-column
          v-if="tabRowState === '36'"
          key="type"
          data-index="type"
          align="center"
          width="12%"
        >
          <span slot="title"> 库位选择</span>
          <template slot-scope="text, record" class="box-sizes">
            <span v-if="record.isLocation === '1'">
              {{
                record.locationName === null || record.locationName === ""
                  ? "暂无库位"
                  : record.locationName
              }}
            </span>
            <a-cascader
              :disabled="record.type === '10181' || record.type === '10186'"
              v-if="record.isLocation === '0'"
              :style="
                (record.locationId === null || record.locationId === '') &&
                record.type != '10181' &&
                record.type != '10186'
                  ? 'border: 1px solid #f00;border-radius:5px'
                  : 'border: 1px solid #ccc;border-radius:5px'
              "
              size="small"
              placeholder=""
              :options="storageLocation"
              change-on-select
              @change="
                (value, selectedOptions) =>
                  onChangeLocation(value, selectedOptions, record)
              "
            />
          </template>
        </a-table-column>
        <!-- //操作 -->
        <a-table-column
          key="operation"
          data-index="operation"
          title="操作"
          width="200px"
          align="center"
        >
          <template slot-scope="text, record">
            <a
              v-if="tabRowState === '36' && record.isLocation === '0'"
              href="javascript:;"
              style="color: #2929e0; border-bottom: 1px solid #2929e0"
              @click="savaCheckRowData(record)"
              >保存</a
            >
            <a-divider
              v-if="tabRowState === '36' && record.isLocation === '0'"
              type="vertical"
            />
            <a
              href="javascript:;"
              style="color: #2929e0; border-bottom: 1px solid #2929e0"
              @click="lookImg(record)"
              >查看图片</a
            >
            <a-divider
              type="vertical"
              v-if="record.tenantId === '' || record.tenantId === null"
            />
            <a
              v-if="record.tenantId === '' || record.tenantId === null"
              href="javascript:;"
              style="color: #2929e0; border-bottom: 1px solid #2929e0"
              @click="showClientModal(record)"
              >客户选择</a
            >
          </template>
        </a-table-column>
      </a-table>
    </a-modal>

    <!-- //查看图片 -->
    <a-modal v-model="lookImgVisible" title="查看图片" width="50%">
      <template slot="footer">
        <a-button
          style="background: #d7d7d7; color: #fff; border: none"
          @click="lookImgVisible = false"
          >取消</a-button
        >
      </template>
      <span v-if="imgUrlArray.length >= 1">
        <img
          @click="lookImgs(item)"
          :src="item"
          :style="
            imgUrlArray.length <= 0
              ? ''
              : 'width: 200px; height: 200px; margin: 15px; cursor: pointer'
          "
          v-for="(item, i) in imgUrlArray"
          :key="i"
        />
      </span>
      <span v-else> 还未上传图片！ </span>
    </a-modal>
    <!-- 客户选择模态框 -->
    <a-modal v-model="clientVisible" title="查询批次">
      <template slot="footer">
        <a-button
          style="background: #d7d7d7; color: #fff; border: none"
          @click="
            () => {
              this.clientVisible = false;
            }
          "
          >取消</a-button
        >
        <a-button :loading="loading" type="primary" @click="modalSearch"
          >确认</a-button
        >
      </template>
      <a-form-model
        ref="searchBathFrom"
        :model="searchBath"
        :rules="searchBathRules"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item label="客户编号：" prop="tenantId">
          <a-select
            show-search
            option-filter-prop="children"
            :filter-option="filterOption"
            v-model="searchBath.tenantId"
            @change="tenantIdBath"
          >
            <a-select-option
              :value="item.tenantId"
              v-for="item in accArray"
              :key="item.id"
              :titles="item.title"
            >
              {{ item.tenantId }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="处理批次号:" prop="batchNo">
          <a-select
            show-search
            option-filter-prop="children"
            :filter-option="filterOption"
            v-model="searchBath.batchNo"
          >
            <a-select-option
              :value="item.batchNo"
              v-for="item in tenantIdBathArray"
              :key="item.id"
            >
              {{ item.batchNo }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
    <!-- //图片放大 -->
    <a-modal
      :visible="previewVisible"
      :footer="null"
      @cancel="previewVisible = false"
    >
      <img alt="example" style="width: 100%" :src="previewImage" />
    </a-modal>

    <!-- 服务项登记 -->
    <CreationBathService :getTabList="getTabList" />

    <!-- 服务项信息查看 -->
    <ServiceModalReap :getModalData="getTabList" />
  </div>
</template>

<script>
import {
  by_retreat_batch,
  by_retreat_pageBatch,
  by_retreat_forecastInfoGet,
  by_retreat_batchCsrlist,
  by_retreat_batchCsdUpdate,
  by_retreat_batchwhSubmit,
  by_retreat_batchforecastInfo,
  by_retreat_whUpdate,
} from "@/apis/clientSide/ReturnsList/ReturnsList";
import moment from "moment";
import { mapState } from "vuex";
import { warehouse_select } from "@/apis/common";
import CreationBathService from "./CreationBathService.vue";
import ServiceModalReap from "@/components/serviceModal/ServiceModalReap.vue";
export default {
  props: ["tabKey"],
  components: {
    CreationBathService,
    ServiceModalReap,
  },
  mounted() {
    this.getTabList();
  },
  data() {
    return {
      spinning: false,
      endTime: null,
      //库位数据
      storageLocation: [],

      //根据客户编号出来的批次
      tenantIdBathArray: [],
      //查询批次
      searchBath: {
        batchNo: null,
        tenantId: null,
      },
      //查询批次验证
      searchBathRules: {
        tenantId: [
          {
            required: true,
            message: "客户编号不能为空",
            trigger: "blur",
          },
        ],
        batchNo: [
          {
            required: true,
            message: "批次名称不能为空",
            trigger: "blur",
          },
        ],
      },
      clientVisible: false,
      lookImgVisible: false,
      previewImage: "",
      previewVisible: false,
      imgUrlArray: [],
      //模态框表格数据
      tableListModal: [],
      tabInfoVisible: false,
      moment,
      total: 1,
      labelCol: { span: 6 },
      wrapperCol: { span: 16 },
      rules: {
        batchName: [
          {
            required: true,
            message: "批次名不能为空",
            trigger: "blur",
          },
        ],
        warehousingId: [
          {
            required: true,
            message: "请选择仓库",
            trigger: "blur",
          },
        ],
        endTime: [
          {
            required: true,
            message: "自动销毁时间为必填项",
            trigger: "change",
          },
        ],
      },
      addBath: {
        batchName: null,
        endTime: null,
        tenantId: null,
        warehousingId: null,
        warehousingName: null,
      },
      loading: false,
      visible: false,
      tabData: [],
      searchData: {
        size: 10,
        current: 1,
        batchNo: null,
        tenantId: null,
        isNo: "3",
        batchState: this.tabKey === "0" ? "" : this.tabKey,
      },
      //详细数据每一行
      modalTableRowData: {},
      oldBatchNo: null,
      tabRowState: "",
      tabRowDataId: null,
    };
  },
  methods: {
    disabledDate(current) {
      return current && current < moment().endOf("day");
    },
    //费用服务项信息查看
    costServiceInfo(record) {
      setTimeout(() => {
        if (record.state === "36") {
          this.$bus.$emit(
            "reappearance",
            record,
            7,
            record.id,
            true,
            "warehouse"
          );
        } else {
          this.$bus.$emit("reappearance", record, 7, record.id, false);
        }
      }, 50);
    },
    //退件服务项登记
    returnServiceModal(record) {
      setTimeout(() => {
        console.log(record);
        this.$bus.$emit("CreationBathService", record);
      }, 50);
    },
    //待仓库处理保存按钮
    async savaCheckRowData(record) {
      if (
        (record.locationId === null || record.locationId === "") &&
        record.type != "10181" &&
        record.type != "10186"
      ) {
        this.$message.error("请选择库位！");
        return false;
      }
      record.isLocation = "1";
      let { code } = await by_retreat_batchforecastInfo(record);
      if (code === "10000") {
        record.isLocation = "1";
      }
    },
    // 仓位改变
    onChangeLocation(value, selectedOptions, record) {
      record.locationId = value.join(",");
      let arr = [];
      selectedOptions.forEach((item) => {
        arr.push(item.titleName);
      });
      record.locationName = arr.join(",");
    },
    //打开服务项模态框
    clientVisibleShow() {
      this.serveVisible = true;
    },
    //提交至审核中心
    onSubmitDataInfo() {
      this.loading = true;
      this.passFlag = true;
      this.tableListModal.forEach((item) => {
        if (item.isLocation === "0") {
          this.passFlag = false;
        }
      });
      if (this.passFlag) {
        setTimeout(async () => {
          let { code } = await by_retreat_whUpdate(this.tabRowDataId);
          if (code === "10000") {
            this.loading = false;
            this.tabInfoVisible = false;
            this.getTabList();
          }
        }, 1000);
      } else {
        this.$message.error("请检查是否有未保存项！");
        this.loading = false;
      }
    },
    //待客户确认提交商品数据
    onSubmitRow(record) {
      let _this = this;
      this.$confirm({
        title: "确认提交批次号为" + record.batchNo + "的订单吗?",
        cancelText: "取消",
        okText: "确认",
        onOk() {
          return new Promise((resolve) => {
            setTimeout(async () => {
              let { code } = await by_retreat_batchwhSubmit(record.batchNo);
              if (code === "10000") {
                _this.getTabList();
                resolve();
              } else {
                resolve();
              }
            }, 1000);
          }).catch(() => console.log("Oops errors!"));
        },
        onCancel() {},
      });
    },
    //模态框确认按钮
    modalSearch() {
      this.$refs.searchBathFrom.validate(async (valid) => {
        if (valid) {
          let { code } = await by_retreat_batchCsdUpdate(
            this.oldBatchNo,
            this.searchBath.batchNo,
            this.modalTableRowData
          );
          if (code === "10000") {
            let { code, responseBody } = await by_retreat_forecastInfoGet(
              this.oldBatchNo
            );
            if (code === "200") {
              this.tableListModal = responseBody;
              this.clientVisible = false;
              this.getTabList();
            }
          }
        } else {
          this.$message.error("请输入必填项！");
        }
      });
    },
    //客户编号失焦验证
    async tenantIdBath(value) {
      if (value != "" && value != null) {
        let { code, responseBody } = await by_retreat_batchCsrlist(value);
        if (code === "200") {
          if (responseBody.length <= 0) {
            this.$message.error("客户编号" + value + "未查询到可选批次！");
          } else {
            this.tenantIdBathArray = responseBody;
          }
        }
      }
    },
    //客户选择模态框
    showClientModal(record) {
      this.modalTableRowData = record;
      this.clientVisible = true;
      this.searchBath = {
        batchNo: null,
        tenantId: null,
      };
    },
    //图片放大
    lookImgs(url) {
      this.previewImage = url;
      this.previewVisible = true;
    },
    //每一行数据详情表格
    async rowInfo(record) {
      this.tabRowDataId = record.id;
      this.tabRowState = record.state;
      this.oldBatchNo = record.batchNo;
      let { code, responseBody } = await by_retreat_forecastInfoGet(
        record.batchNo
      );
      if (code === "200") {
        this.tableListModal = responseBody;
        this.tabInfoVisible = true;
        this.getStorageLocation(record.warehousingId);
      }
    },
    //查看图片
    lookImg(record) {
      this.imgUrlArray =
        record.file === "" || record.file === null
          ? []
          : record.file.split(",");
      this.lookImgVisible = true;
    },
    // 新增批次
    onSubmit() {
      this.loading = true;
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          setTimeout(async () => {
            this.addBath.tenantId =
              this.addBath.tenantId === "" ? null : this.addBath.tenantId;
            let { code } = await by_retreat_batch(this.addBath);
            if (code === "10000") {
              this.getTabList();
              this.loading = false;
              this.visible = false;
            } else {
              this.loading = false;
            }
          }, 1000);
        } else {
          this.$message.error("请检查必填项");
          this.loading = false;
        }
      });
    },
    //仓库选择
    handleChange(value, option) {
      this.addBath.warehousingId = value;
      this.addBath.warehousingName = option.data.attrs.name;
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    //到期时间选择
    onChangeTime(date, dateString) {
      this.addBath.endTime = dateString;
    },
    //重置按钮
    resetSearch() {
      let current = this.searchData.current;
      let size = this.searchData.size;
      this.searchData = {
        size: size,
        current: current,
        batchNo: null,
        tenantId: null,
        isNo: "3",
      };
      this.getTabList();
    },
    //显示模态框
    showMoadal() {
      this.visible = true;
      this.endTime = null;
      this.addBath = {
        batchName: null,
        endTime: null,
        tenantId: null,
        warehousingId: null,
        warehousingName: null,
      };
    },
    //分页器事件
    onChangePage(pageNumber) {
      this.searchData.current = pageNumber;
      this.getTabList();
    },
    //页码变更
    showChange(size, current) {
      this.searchData.current = size;
      this.searchData.size = current;
      this.getTabList();
    },
    async getTabList() {
      this.spinning = true;
      let { code, responseBody } = await by_retreat_pageBatch(this.searchData);
      if (code === "200") {
        this.total = responseBody.total * 1;
        this.tabData = responseBody.records;
        this.tabData.forEach((item) => {
          if (item.days * 1 <= 0) {
            item.days = "已延期" + item.days + "天";
          } else {
            item.days = item.days + "天";
          }
        });
        this.spinning = false;
      }
    },
    //获取库位
    async getStorageLocation(id) {
      let { code, responseBody } = await warehouse_select({
        warehousePid: id,
        isTree: true,
      });
      if (code === "200") {
        this.storageLocation = this.getSkuTypeThree(responseBody);
      }
    },
    //封装组装后台数据
    getSkuTypeThree(data) {
      data.forEach((item) => {
        item.label = item.titleName;
        item.children = item.child;
        item.value = item.warehouseId;
        item.sort = this.sort;
        if (item.children && item.children.length >= 1) {
          this.sort += 1;
          this.getSkuTypeThree(item.children);
        }
      });
      this.sort = 0;
      return data;
    },
  },
  computed: {
    ...mapState(["warehouse"]),
    ...mapState(["accArray"]),
    columns() {
      return [
        {
          title: "客户编号",
          dataIndex: "tenantId",
          align: "center",
          width: "8%",
        },
        {
          title: "批次号",
          dataIndex: "batchNo",
          align: "center",
          // scopedSlots: { customRender: "selfClassifyName" },
          width: "10%",
        },
        {
          title: "批次名称",
          dataIndex: "batchName",
          align: "center",
          // scopedSlots: { customRender: "selfClassifyName" },
          width: "8%",
        },
        {
          title: "仓库",
          dataIndex: "warehousingName",
          align: "center",
          width: "8%",
        },
        {
          title: "运单总数",
          dataIndex: "waybillCount",
          align: "center",
          width: "10%",
          scopedSlots: { customRender: "waybillCount" },
        },
        {
          title: "入库数量",
          dataIndex: "putCount",
          scopedSlots: { customRender: "putCount" },
          align: "center",
          width: "8%",
        },
        {
          title: "销毁数量",
          dataIndex: "destructionCount",
          scopedSlots: { customRender: "destructionCount" },
          align: "center",
          width: "8%",
        },
        {
          title: "退回数量",
          dataIndex: "backCount",
          scopedSlots: { customRender: "backCount" },
          align: "center",
          width: "8%",
        },
        {
          title: "状态",
          dataIndex: "batchState",
          scopedSlots: { customRender: "batchState" },
          align: "center",
          width: "13%",
        },
        {
          title: "创建时间",
          dataIndex: "createTime",
          scopedSlots: { customRender: "createTime" },
          align: "center",
          width: "10%",
        },
        {
          title: "自动销毁时间",
          dataIndex: "endTime",
          scopedSlots: { customRender: "endTime" },
          align: "center",
          width: "10%",
        },
        {
          title: "倒计时",
          dataIndex: "days",
          scopedSlots: { customRender: "days" },
          align: "center",
          width: "10%",
        },
        {
          title: "操作",
          dataIndex: "action",
          scopedSlots: { customRender: "action" },
          align: "center",
          width: 220,
          fixed: "right",
        },
      ];
    },
  },
};
</script>

<style lang="less" scoped>
.searchBtn {
  background: #fff;
  color: #3eae7c;
  text-shadow: none;
}
.searchBtn:hover {
  background: #3eae7c;
  color: #fff;
}
/deep/.ant-modal-footer {
  text-align: center !important;
  button {
    margin: 0 50px;
  }
}
</style>
